<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8" isELIgnored="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>添加图书</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/style.css" />
	</head>
	<body>
		<div id="wrap">
			<div id="top_content">
					<div id="header">
						<div id="rightheader">
							<p>
								2009/11/20
								<br />
							</p>
						</div>
						<div id="topheader">
							<h1 id="title">
								<a href="#">main</a>
							</h1>
						</div>
						<div id="navigation">
						</div>
					</div>
				<div id="content">
					<p id="whereami">
					</p>
					<h1>
						添加图书信息
					</h1>
					<form action="${pageContext.request.contextPath}/book/insertMvc.do" method="post" onsubmit="return checkAllInput()">
						<table cellpadding="0" cellspacing="0" border="0"  class="form_table">
							<tr>
								<td valign="middle" align="right">
									图书名称:
								</td>
								<td valign="middle" align="left">
									<script>
										function checkBook(){
											var bookName = document.getElementById("bookName")
											var spanName = document.getElementById("spanName")
											var e = bookName.value
											if(e=='' || e==null || e==undefined){
												spanName.innerHTML = "No Ok"
												spanName.style = "color:red"
												return false
											}else{
												spanName.innerHTML = "Ok"
												spanName.style = "color:green"
												return true
											}
										}
										function checkPrice(){
											var bookPrice = document.getElementById("bookPrice")
											var spanPrice = document.getElementById("spanPrice")
											var e = bookPrice.value
											if(e=='' || e==null || e==undefined){
												spanPrice.innerHTML = "No Ok"
												spanPrice.style = "color:red"
												return false
											}else{
												spanPrice.innerHTML = "Ok"
												spanPrice.style = "color:green"
												return true
											}
										}
										function checkAuthor(){
											var author = document.getElementById("author")
											var spanAuthor = document.getElementById("spanAuthor")
											var e = author.value
											if(e=='' || e==null || e==undefined){
												spanAuthor.innerHTML = "No Ok"
												spanAuthor.style = "color:red"
												return false
											}else{
												spanAuthor.innerHTML = "Ok"
												spanAuthor.style = "color:green"
												return true
											}
										}
										function checkAllInput(){
											return checkBook()&&checkPrice()&&checkAuthor()
										}
									</script>
									<input type="text" class="inputgri" name="bookName" onblur="checkBook()" id="bookName"/><span id="spanName"></span>
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
									图书价格:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" name="bookPrice" onblur="checkPrice()" id="bookPrice"/><span id="spanPrice"></span>
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
								         作者:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" name="author" onblur="checkAuthor()" id="author"/><span id="spanAuthor"></span>
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
									类别:
								</td>
								<td valign="middle" align="left">
									<select name="typeName">
										<c:forEach var="type" items="${typeList}">
											<option>${type.typeName}</option>
										</c:forEach>
									</select>
								</td>
							</tr>
						</table>
						<p>
							<input type="submit"  class="button" value="添加" />
						</p>
					</form>
				</div>
			</div>
			<div id="footer">
				<div id="footer_bg">
					ABC@126.com
				</div>
			</div>
		</div>
	</body>
</html>
